$foo: ('foo': 'bar', 'bar': ('foo': 'bze'))

.parent
  &__child
    p::first-line
      content: ''
        content: 'ta'

.foo,
.bar
  content: 'bar'

    content: 'baz'
        content: 'bar'

  +breakpoint(500)
    content: 'baz'
      // comment inside block
      content: 'qux'

  +mixin-extra
    content: 'baz'
    content: 'qux'

  +mixin-empty-args()
    content: 'baz'
    content: 'qux'

    .qux
      content: 'bar'


    @if (1 == 1)
        content: 'foo'

// TODO: Considered invalid Sass - re-evaluate
// =bar
//     content: 'bar'
// 	content: 'baz'

.color
  color: rgba(255, 255, 255, 0.3)

$colors: (base: (red: #fff, blue: #fff), text: (default: #fff, light: (brap: #987), not: (test: #fff)))

.multilineprops
  background: transparent linear-gradient(
    to bottom,
      #ff0000 0%,
    #00ff00 40%,
    #0000ff 40%
  )

.multilineprops-extra
  background: transparent linear-gradient(to bottom, #ff0000 0%, #00ff00 40%, #0000ff 40%)

// Top-level mixin
+hello(
  $foo,
  $bar,
  $baz
)

.foo
  // Nested Mixin
  +hello(
    $foo,
    $bar,
    $baz
  )

  // CSS built-in function
  background: transparent linear-gradient(
    to bottom,
    #ff0000 0%,
    #00ff00 40%,
    #0000ff 40%
  )

  // User-defined function
  content: goodbye(
    $foo,
      $bar
  )

@function cp($target, $container)
  @return calc-percent($target, $container)

// Issue #426 - Unexpected indenting enforcement on multiline rules
=hidpi-background-image($filename, $background-size: 'mixed', $extension: png)
  background-image: url('../images/#{$filename}.#{$extension}')
  @if ($background-size != 'mixed')
    background-size: $background-size

  @media (min--moz-device-pixel-ratio: 1.3)
    background-image: url('../images/#{$filename}@2x.#{$extension}')
  	  color: red

.test
  @media (max-width: 800px), (max-height: 600px)
      #unit
        margin: 16px

.test
  @media (max-width: 800px), (max-height: 600px)
        #unit
          margin: 16px
